<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta property="og:title" content="Recognize all contributors" />
    <meta
      property="og:description"
      content="✨Recognize all contributors, not just the ones who push code ✨"
    />
    <meta property="og:site_name" content="All Contributors" />
    <meta property="og:url" content="https://allcontributors.org" />
    <meta property="og:type" content="website" />
    <meta
      property="og:image"
      content="https://allcontributors.org/img/icons/logo-full.png"
    />
    <script type="application/ld+json">
    {
      "@context" : "http://schema.org",
      "@type" : "SoftwareApplication",
      "name": "All Contributors",
      "image" : "https://allcontributors.org/img/hero.png",
      "author" : "All Contributors",
      "publisher" : "All Contributors",
      "url": "https://allcontributors.org",
      "downloadUrl" : "https://allcontributors.org/docs/en/bot/installation",
      "screenshot" : "https://allcontributors.org/img/add-contributors.png"
      "description": "Recognize all contributors, not just the ones who push code"
    }
    </script>
    <meta name="msapplication-TileColor" content="#ffffff" />
    <meta
      name="msapplication-TileImage"
      content="/img/icons/ms-icon-144x144.png"
    />
    <meta name="theme-color" content="#ffffff" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>
      All Contributors: ✨ Recognize all contributors, not just the ones who
      push code ✨
    </title>
    <link
      rel="apple-touch-icon"
      sizes="57x57"
      href="/img/icons/apple-icon-57x57.png"
    />
    <link
      rel="apple-touch-icon"
      sizes="60x60"
      href="/img/icons/apple-icon-60x60.png"
    />
    <link
      rel="apple-touch-icon"
      sizes="72x72"
      href="/img/icons/apple-icon-72x72.png"
    />
    <link
      rel="apple-touch-icon"
      sizes="76x76"
      href="/img/icons/apple-icon-76x76.png"
    />
    <link
      rel="apple-touch-icon"
      sizes="114x114"
      href="/img/icons/apple-icon-114x114.png"
    />
    <link
      rel="apple-touch-icon"
      sizes="120x120"
      href="/img/icons/apple-icon-120x120.png"
    />
    <link
      rel="apple-touch-icon"
      sizes="144x144"
      href="/img/icons/apple-icon-144x144.png"
    />
    <link
      rel="apple-touch-icon"
      sizes="152x152"
      href="/img/icons/apple-icon-152x152.png"
    />
    <link
      rel="apple-touch-icon"
      sizes="180x180"
      href="/img/icons/apple-icon-180x180.png"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="192x192"
      href="/img/icons/android-icon-192x192.png"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="/img/icons/favicon-32x32.png"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="96x96"
      href="/img/icons/favicon-96x96.png"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="16x16"
      href="/img/icons/favicon-16x16.png"
    />
    <link rel="manifest" href="/manifest.json" />
    <link
      href="https://fonts.googleapis.com/css?family=Poppins:300,400,400i,600"
      rel="stylesheet"
    />
    <link rel="stylesheet" href="/css/main.css" />
    <script
      type="text/javascript"
      src="https://buttons.github.io/buttons.js"
    ></script>
    <script>
      ;(function(i, s, o, g, r, a, m) {
        i['GoogleAnalyticsObject'] = r
        ;(i[r] =
          i[r] ||
          function() {
            ;(i[r].q = i[r].q || []).push(arguments)
          }),
          (i[r].l = 1 * new Date())
        ;(a = s.createElement(o)), (m = s.getElementsByTagName(o)[0])
        a.async = 1
        a.src = g
        m.parentNode.insertBefore(a, m)
      })(
        window,
        document,
        'script',
        'https://www.google-analytics.com/analytics.js',
        'ga'
      )

      ga('create', 'UA-131821931-1', 'auto')
      ga('send', 'pageview')
    </script>
  </head>
  <body class="homepage">
    <header class="container header">
      <a href="#"><img class="logo" src="img/logo.svg" alt="All Contributors logo"/></a>
      <nav>
        <ul>
          <li><a href="/docs">Docs</a></li>
          <li>
            <a href="https://github.com/all-contributors/all-contributors"
              >Github</a
            >
          </li>
          <li class="github-star">
            <a
              class="github-button"
              href="https://github.com/all-contributors/all-contributors"
              data-icon="octicon-star"
              data-count-href="/all-contributors/all-contributors/stargazers"
              data-show-count="true"
              data-count-aria-label="# stargazers on GitHub"
              aria-label="Star this project on GitHub"
              >Star</a
            >
          </li>
        </ul>
      </nav>
    </header>
    <div class="hero container">
      <div class="col-6 mobile-col-12">
        <h1>Recognize All Contributors</h1>
        <p>Including those that don't push code</p>
        <a href="/docs/en/bot/installation" class="hero-button cta-button"
          >Install the Bot</a
        >
      </div>
      <div class="col-7 mobile-col-12">
        <img
          src="img/hero.png"
          srcset="img/hero.png 1x, ./img/hero@2x.png 2x"
          alt="hero image"
        />
      </div>
    </div>
    <div class="wave"></div>
    <div class="benefits">
      <div class="container centred-content ">
        <h2>Add New Contributors in Seconds</h2>
        <p>
          We’ve built a bot to automate the tedious stuff for adding project
          contributors, so you can focus on your project instead of managing
          your ReadMe.
        </p>
        <img
          src="img/add-contributors.png"
          srcset="img/add-contributors.png 1x, ./img/add-contributors@2x.png 2x"
          alt="contributors bot screenshot"
        />
      </div>
    </div>

    <div class="container quick-links">
      <div class="tile-group">
        <div class="tile">
          <a href="/docs/en/overview">
            <div class="tile-icon">
              <img src="../img/article.svg" alt="documentation icon" />
            </div>
            <h5>Read the Documentation</h5>
          </a>
        </div>
        <div class="tile">
          <a href="/docs/en/emoji-key">
            <div class="tile-icon">
              <img src="../img/emoji.svg" alt="emoji icon" />
            </div>
            <h5>Emoji Key (Contributions Cheatsheet)</h5>
          </a>
        </div>
        <div class="tile">
          <a href="/docs/en/bot/usage">
            <div class="tile-icon">
              <img src="../img/help.svg" alt="help icon" />
            </div>
            <h5>How to Use the Bot</h5>
          </a>
        </div>
        <div class="tile">
          <a
            href="https://github.com/all-contributors/all-contributors-bot/issues"
          >
            <div class="tile-icon">
              <img src="../img/warning.svg" alt="issue icon" />
            </div>
            <h5>Submit an Issue</h5>
          </a>
        </div>
      </div>
    </div>
    <div class="container how-to">
      <div class="col-7 mobile-col-12">
        <img
          src="img/how-it-works-graphic.png"
          srcset="
            img/how-it-works-graphic.png      1x,
            ./img/how-it-works-graphic@2x.png 2x
          "
          alt="how it works"
        />
      </div>
      <div class="col-5 mobile-col-12">
        <h2>How it Works</h2>
        <ol>
          <li>
            <h3>1. Install the Bot to your project</h3>
            <p>
              Check the
              <a href="/docs/en/bot/installation"> Installation doc</a> for how
              to add it
            </p>
          </li>
          <li><h3>2. Start a pull request or comment</h3></li>
          <li><h3>3. Mention the @all-contributors Bot</h3></li>
          <li>
            <h3>4. Add a contributor’s username and contribution type</h3>
            <p>
              Check the contribution types in the
              <a href="/docs/en/emoji-key">Emoji Key Cheatsheet</a>
            </p>
          </li>
          <li>
            <h3>5. Post and your ReadMe updates automatically!</h3>
            <p>It'll add the Contributor Table for your first time, too</p>
          </li>
        </ol>
      </div>
    </div>

    <div class="container centred-content users">
      <h2>Who's Using it?</h2>
      <p>There are 2000+ Projects using All Contributors!</p>
      <div class="user-logos">
        <div class="col-3 mobile-col-6">
          <a
            href="https://github.com/processing/p5.js"
            rel="noopener"
            target="_blank"
          >
            <img
              src="img/p5js.png"
              srcset="img/p5js.png 1x, ./img/p5js@2x.png 2x"
              alt="p5js logo"
            />
          </a>
        </div>
        <div class="col-3 mobile-col-6">
          <a
            href="https://github.com/snipe/snipe-it"
            rel="noopener"
            target="_blank"
          >
            <img
              src="img/snipeit.png"
              srcset="img/snipeit.png 1x, ./img/snipeit@2x.png 2x"
              alt="snipe it logo"
            />
          </a>
        </div>
        <div class="col-3 mobile-col-6">
          <a
            href="https://github.com/developer-learning/night-reading-go"
            rel="noopener"
            target="_blank"
          >
            <img
              src="img/golearning.png"
              srcset="img/golearning.png 1x, ./img/golearning@2x.png 2x"
              alt="night reading go logo"
            />
          </a>
        </div>
        <div class="col-3 mobile-col-6">
          <a
            href="https://github.com/jaredpalmer/formik"
            rel="noopener"
            target="_blank"
          >
            <img
              src="img/formik.png"
              srcset="img/formik.png 1x, ./img/formik@2x.png"
              alt="formik logo"
            />
          </a>
        </div>
      </div>
    </div>

    <div class="final-cta">
      <div class="container final-cta centred-content">
        <h4>Start adding contributors to your project today</h4>
        <a href="/docs/en/bot/installation" class="cta-button cta-primary"
          >Install the Bot</a
        >
        <a href="/docs/en/overview" class="cta-button cta-secondary"
          >Read the Docs</a
        >
      </div>
    </div>

    <footer class="homepage__footer"><div class="container"></div></footer>
  </body>
</html>
